<?xml version='1.0' encoding='UTF-8' ?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//ES" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html" 
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title><ui:insert name="title">sismundo.com</ui:insert></title>
        <link rel="Shortcut Icon" type="image/x-icon" href="images/SisVentas_Logo.png" />
        <link rel="Shortcut Icon" type="image/x-icon" href="../images/SisVentas_Logo.png" />
        <link rel="stylesheet" type="text/css" href="resources/css/style.css" />
        <link rel="stylesheet" href="../resources/css/style.css" type="text/css"/>
        <script type="text/javascript" src="resources/js/boxOver.js"></script>

        <!-- Efecto de movimiento -->

        <script type="text/javascript">
            function handleLoginRequest(xhr, status, args) {
                if (args.validationFailed || !args.loggedIn) {
                    jQuery('#dialog').effect("shake", {times: 3}, 100);
                } else {
                    dlg.hide();
                }
            }
        </script> 
    </h:head>

    <body id="bodyTemp">
        <f:view>
            <center>
                <table width="95%" border="0" align="center">
                    <tr>
                        <td colspan="5">
                            <h:form id="formCab">
                                <div id="header">                        
                                    <div class="logo"> <img src="/images/SisVentas_Logo.png" width="130" height="130" alt="SisVentas Logo"/> </div>
                                    <div class="descri">
                                        <h1>sismundo.com</h1>
                                        Sistema de ventas <br/>
                                        en línea </div>

                                    <!-- Menú Superior -->

                                    <ul class="menu">
                                        <li><p:commandLink id="ingreso" onclick="dlg.show();" value="#{loginBean.msjIngreso}" styleClass="nav3"/></li>
                                        <li class="divider"></li>
                                        <li> 
                                            <h:link id="cmdlinkUs" outcome="/usuario/Nuevo" value="#{bundle.ListUsuarioCreateLink}" styleClass="nav4"/>
                                        </li>
                                        <li class="divider"></li>
                                        <li>
                                            <h:link id="cmdlinkAr" outcome="/Vender" value="#{bundle.CreateArtiservTitle}" styleClass="nav5"/>
                                        </li>
                                        <li class="divider"></li>
                                    </ul>
                                    <div class="barra_de_busqueda">

                                        <h:inputText styleClass="texto_a_buscar"/>
                                        <h:commandButton value="Buscar" styleClass="boton_buscar"/>
                                    </div>
                                </div>
                            </h:form>
                        </td>
                    </tr>
                    <tr>
                        <td width="17%">&nbsp;</td>
                        <td width="64%">
                            <!-- Cotenido principal -->
                            <ui:insert name="body">

                            </ui:insert> 
                        </td>
                        <td width="19%" colspan="3">&nbsp;</td>
                    </tr>

                </table>
                <!-- Pié de págian -->


                <!-- Formulario de Ingreso -->

                <p:dialog id="dialog" header="Login" widgetVar="dlg" modal="true" showEffect="explode" hideEffect="bounce">
                    <h:form id="formIngr">
                        <p:growl id="growl" showDetail="true" life="3000" />
                        <h:panelGrid columns="2" cellpadding="5">

                            <h:outputLabel for="username" value="Username:" />
                            <p:inputText value="#{loginBean.username}" 
                                         id="username" required="true" label="username" />

                            <h:outputLabel for="password" value="Password:" />
                            <h:inputSecret value="#{loginBean.password}" 
                                           id="password" required="true" label="password" />

                            <f:facet name="footer">
                                <p:commandButton id="loginButton" value="Login" update="growl, :formCab:ingreso"
                                                 actionListener="#{loginBean.login}" 
                                                 oncomplete="handleLoginRequest(xhr, status, args)">
                                </p:commandButton>
                            </f:facet>
                        </h:panelGrid>
                    </h:form>
                </p:dialog>
            </center>
        </f:view>
    </body>
</html>
